<%@ page language="java" import="java.util.*,com.thinkgem.jeesite.modules.fantasy.entity.ItemType" pageEncoding="utf-8"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,Chrome=1" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="${ctxStatic}/layui/css/layui.css">
<link rel="stylesheet" type="text/css" href="${ctxStatic}/css/fantasy-street.css">
<style type="text/css">

</style>
<script language="javascript">
</script>
<title>【${cityMap.cityname }】${cityMap.placename }</title>
</head>
<body>
<div class="container">
 	<div class="main">
	    <div id="place">
			<div class="placetitle">
				【${cityMap.cityname }】${cityMap.placename }${cityMap.id }
			</div>
			<div class="placedesc">
				${cityMap.placedesc }
			</div>
		</div>
		<div class="npc">
			<div id="talkshow" onclick="hiddentalkshow();">
				<div id="talkshowclose">
					<a onclick="hiddentalkshow();">X</a>
				</div>
				<div id="talkshowdetail">
					
				</div>
			</div>
			
			<c:if test="${npclist != null }">
				<c:forEach items="${npclist}" var="npc">
					<div class="npcdiv" id="npc_${npc.id }" onmousedown="showDiv(npcdesc_${npc.id });" onmouseout="hiddenDiv(npcdesc_${npc.id });">
						<img alt="a${npc.name }" title="t${npc.name }" src="${ctxStatic}/images/fantasy/${npc.facesrc }">
					 	<div id="npcdesc_${npc.id }" class="npcdescdiv" onmouseover="mouseoverDiv()" onmouseout="mouseoutDiv(npcdesc_${npc.id },event);">
					 		<div id="npctitle">
					 			${npc.name }
					 		</div>
					 		<div id="npcdesc">
					 			${npc.desc }
					 		</div>
					 		<div id="npcbutton">
					 			<div id="talktonpc" onclick="talkshow('${npc.id }');">
					 				交谈
					 			</div>
					 			<div id="asktonpc" onclick="hiddenThis(npcdesc_${npc.id });alert('询问');">
					 				询问
					 			</div>
					 			<div id="applyfromnpc">
					 				接受任务
					 			</div>
					 			<div id="passtonpc">
					 				给道具
					 			</div>
					 			<div id="refusetask">
					 				推任务
					 			</div>
					 		</div>
					 	</div>
					</div>
				</c:forEach>
			</c:if>
		</div>
	    <div class="groundtitle">
			地上的道具
		</div>
		<div class="ground">
			<table>
				<tr>
					<td colspan="10">
						点击地上的道具可以将它收入囊中哦！
					</td>
				</tr>
				<tr>
				<c:if test="${itemList == null}">
					<c:forEach varStatus="status" begin="0" end="29" step="1">
						<td>
						</td>
						<c:if test="${status.index%10 == 9 }">
							</tr>
							<tr>
						</c:if>
					</c:forEach>
				</c:if>
				<c:forEach var="item" items="${itemList }" varStatus="status">
					<td>
						<c:if test="${item != null }">
							<a id="item_${index }" href="javascript:pickitem(${user.id }, ${cityMap.id }, ${index });">
								<img alt="a${item.name}" title="t${item.name}"
								 src="${ctxStatic}/images/fantasy/${item.imgsrc}">
							</a>
						</c:if>
					</td>
					<c:if test="${status.index%10 == 9 }">
						</tr>
						<tr>
					</c:if>
				</c:forEach>
				</tr>
			</table>
		</div>
    </div>
    <div class="sidebox">
	    <select id="userlist" name="userlist"  class="selectStyle" multiple="multiple">
			<c:if test="${userlist != null }">
				<c:forEach items="${userlist}" var="user">
					<option value='${user.userid }'>${user.name }</option>
				</c:forEach>
			</c:if>
		</select>
	    <div class="event">
			<div class="eventtitle">
				特殊事件
			</div>
			<div class="eventitem">
				<div id="gohome">
					<a target="_parent" href="javascript:toHome()"><font>回家</font></a>
				</div>
			</div>
		</div>
		<div class="quickmove">
			<div class="quickmovetitle">
				快速移动
			</div>
			<div class="quickmoves">
				<a target="_top" href="javascript:toHome()"><font>回家</font></a>
			</div>
		</div>
    </div>
</div>
</body>
<script type="text/javascript" src="${ctxStatic}/easyui/jquery.min.js"></script>
<script type="text/javascript" src="${ctxStatic}/js/moveto.js"></script> 
<script language="javascript">
var ctxf = "${ctxf}";
$(function(){
    var compassframe = parent.homeleftframe;
	compassframe.northwest = "${cityMap.northwest }";
	compassframe.north = "${cityMap.north }";
	compassframe.northeast = "${cityMap.northeast }";
	compassframe.west = "${cityMap.west }";
	compassframe.east = "${cityMap.east }";
	compassframe.southwest = "${cityMap.southwest }";
	compassframe.south = "${cityMap.south }";
	compassframe.southeast = "${cityMap.southeast }";
	compassframe.cur = "${cityMap.id }";
	if (compassframe.northwest != null && compassframe.northwest != "") {
		compassframe.document.getElementById("northwest").style.display = 'block';
	} else {
		compassframe.document.getElementById("northwest").style.display = 'none';
	}
	if (compassframe.north != null && compassframe.north != "") {
		compassframe.document.getElementById("north").style.display = 'block';
	} else {
		compassframe.document.getElementById("north").style.display = 'none';
	}
	if (compassframe.northeast != null && compassframe.northeast != "") {
		compassframe.document.getElementById("northeast").style.display = 'block';
	} else {
		compassframe.document.getElementById("northeast").style.display = 'none';
	}
	
	if (compassframe.west != null && compassframe.west != "") {
		compassframe.document.getElementById("west").style.display = 'block';
	} else {
		compassframe.document.getElementById("west").style.display = 'none';
	}
	if (compassframe.east != null && compassframe.east != "") {
		compassframe.document.getElementById("east").style.display = 'block';
	} else {
		compassframe.document.getElementById("east").style.display = 'none';
	}

	if (compassframe.southwest != null && compassframe.southwest != "") {
		compassframe.document.getElementById("southwest").style.display = 'block';
	} else {
		compassframe.document.getElementById("southwest").style.display = 'none';
	}
	if (compassframe.south != null && compassframe.south != "") {
		compassframe.document.getElementById("south").style.display = 'block';
	} else {
		compassframe.document.getElementById("south").style.display = 'none';
	}
	if (compassframe.southeast != null && compassframe.southeast != "") {
		compassframe.document.getElementById("southeast").style.display = 'block';
	} else {
		compassframe.document.getElementById("southeast").style.display = 'none';
	}
	//走到居住区时，显示回家按钮
	if ("${user.homePoint}" == "${cityMap.id}") {
		document.getElementById("gohome").style.display = "block";	
	}
});

function toHome() {
    var url = "${pageContext.request.contextPath}/fantasy/move/toHomeMain";
    parent.homeleftframe.window.location = "${pageContext.request.contextPath}/fantasy/move/toHomeLeft?fromid=${cityMap.id }";
    parent.contentframe.window.location = url;
}
</script>
</html>